<template>
  <div class="email-info">
    <p class="set"></p>
    <div class="top">
      <img v-if="item.emailCustomerVO.type" src="../../../../public/img/email/icon/hasSet.png" alt="">
      <img v-else src="../../../../public/img/email/icon/noSet.png" alt="">
      <h1 class="more">{{filterEmail(item)}}</h1>
    </div>
    <div class="bottom-one" v-if="item.emailCustomerVO.type">
      <!-- 公海 4-->
      <el-button v-if="item.emailCustomerVO.type ==4" :loading="LoadingMove"
                 type="text" class="person" @click.stop="movePerson(item)" >
        移入私海
      </el-button>
      <!--共享 3-->
      <el-button v-else-if="item.emailCustomerVO.type ==3"  :loading="LoadingShare"
                 type="text" @click.stop="cancelShare(item)" >取消共享
      </el-button>
      <!-- 同事建档 2-->
      <el-button v-else-if="item.emailCustomerVO.type==1" :loading="LoadingEdit"
                 type="text" @click.stop="editHasInfo(item)" >
        编辑客户
      </el-button>
      <!-- 我的建档 1-->
      <el-button  v-show="item.emailCustomerVO.type !=4"  @click.stop="changeMan(item)"
                  type="text" :class="item.emailCustomerVO.type==2?'person':''">来往邮件
      </el-button>
    </div>
    <div class="bottom-two" v-else>
      <el-button type="text" @click.stop="notDocuCustomer(item,'newCustomer')">新建客户</el-button>
      <el-button type="text" @click.stop="notDocuCustomer(item,'addHasCustomer')">添加到已有客户</el-button>
      <el-button type="text" @click.stop="changeMan(item)">来往邮件</el-button>
    </div>

  </div>
</template>

<script>
    import {relationCustomer} from "@/api/mail/write";
    import {canCelCust} from '@/api/customer'
    import {getDiffList} from "@/util/util"
    export default {
        name: "ShadowListShow",
        props: ['item','name'],
        data(){
          return{
              LoadingMove:false,
              LoadingEdit:false,
              LoadingShare:false,
              targetName:''
          }
        },
        mounted(){
            if (this.name == 'emailListTab') {//收件箱  this.bus.$on('refreshEmailGet'
                this.targetName = 'SET_EMAILLISTTAB'
            } else if (this.name == 'emailListUnreadTab') {//未读信箱 this.bus.$on('refreshEmailCustomer'
                this.targetName = 'SET_EMAILLISTUNREADTAB'
            } else if (this.name == 'emailListOutTab') {//已发送箱 this.bus.$on('getEmail'
                this.targetName = 'SET_EMAILLISTOUTTAB'
            }else  if(this.name=='emailListPendingTab'){//待处理 this.bus.$on('getEmailPending'
                this.targetName = 'SET_EMAILLISTPENDINGTAB'
            }
        },
        methods: {
            changeMan(row) {
                const ID = this.filterSendEmail(row);
                if (getDiffList(ID, this.name) == -1) {
                    this.$store.commit(this.targetName, {
                        type: 1, row: {
                            id: ID,
                            title: `${ID}往来邮件`,
                            state: 4,
                            close: true
                        }
                    })
                } else {
                    this.$store.commit(this.targetName, {type: 0, current: ID})
                }
            },
            //移入私海
            movePerson(row) {
                this.LoadingMove=true;
                let email = this.filterSendEmail(row)
                this.getCustomerID(email).then(result=>{
                    this.LoadingMove=false;
                    if(result.length==0)return;
                    this.$emit('moveToPerson',result[0].custid)
                })
            },
            //取消共享
            cancelShare(row) {
                this.LoadingShare=true;
                let email = this.filterSendEmail(row)
                this.getCustomerID(email).then(result=>{
                    this.LoadingShare=false;
                    if(result.length==0)return;
                    const customerID=result[0].custid;
                    this.$confirm('取消共享后，您将看不到选中客户的所有信息，您确定要取消共享吗？', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: "success"
                    }).then(() => {
                        canCelCust(customerID).then(res => {
                            if (res.data.success) {
                                this.$emit('refresh');
                                this.$message({
                                    type: 'success',
                                    message: res.data.msg
                                });
                            }
                        })
                    })
                })
            },
            //新建+添加至已有客户 - 区分收件箱还是已发送
            notDocuCustomer(row,name){
                let email = this.filterSendEmail(row)
                this.$emit(name,email)
            },
            //编辑客户
            editHasInfo(row) {
                this.LoadingEdit=true;
                let email = this.filterSendEmail(row)
                this.getCustomerID(email).then(result=>{
                    this.LoadingEdit=false;
                    if(result.length==0)return;
                    this.$emit('editHasInfo',result[0].custid)
                })
            },
            getCustomerID(email){
                return new Promise((resolve,reject)=>{
                    let params = {emailList: email};
                    relationCustomer(params).then(res => {
                        if (res.data.success) {
                            const result = res.data.data;
                            resolve(result)
                        }
                    }).catch((err)=>{
                        reject(err)
                    })
                })

            },
            filterSendEmail(row){
                if (parseInt(row.emailType)) {
                    return row.senderEmail;
                }
                const email = row.addresseeEmail.split(",")[0];
                if (email.indexOf('<') != -1) {//截取
                    let arr = email.split("<");
                    let arr1 = arr[1].split(">")
                    return arr1[0]
                }
                return email
            },
            filterEmail(row) {
                const type = row.emailCustomerVO.type;
                if (type != 0) {
                    let str = row.emailCustomerVO.contactName + " | " + row.emailCustomerVO.enterpriseName;
                    return str
                }
                let name='',email='';
                if (parseInt(row.emailType)) {//收件箱
                    name = row.senderNickName;
                    email = row.senderEmail;
                }else{//已发送
                    //处理多个收件人情况
                    email = row.addresseeEmail.split(',')[0];
                }
                let str = '';
                if (name) {
                    if (name.indexOf("@") != -1) {
                        return name.split("@")[0] + " | " + email
                    }
                    str = name + " | " + email
                } else {
                    str = email.split("@")[0] + " | " + email
                }
                return str;
            }
        }
    }
</script>

<style scoped lang="scss">
  //弹出框
  .email-info {
    position: absolute;
    left: 0;
    top: 30px;
    width: 250px;
    padding: 0 10px;
    background-color: #fff;
    border: 1px solid #D6D6D6;
    box-shadow: 0 0 7px 0 #373B40;
    border-radius: 10px;
    z-index: 2005;

    .set {
      width: 58%;
      left: -5px;
      height: 13px;
      position: absolute;
      top: -15px;
    }

    .top {
      display: flex;
      align-items: center;
      height: 60px;
      border-bottom: 1px solid #F3F3F3;

      img {
        width: 32px;
        height: 32px;
      }

      h1 {
        padding-left: 10px;
        font-size: 14px;
        font-weight: normal;
        color: #2A97F9;
      }
    }

    .el-button.person {
      width: 100% !important;
      border-right: none;
      text-align: center;
    }

    .el-button.person:first-child {
      border-right: none !important;
    }

    .bottom-one {
      .el-button {
        width: 50%;
        margin: 0;
        font-size: 12px;
      }

      .el-button:first-child {
        border-right: 1px solid #F3F3F3;
      }
    }

    .bottom-two {
      .el-button {
        width: 29%;
        margin: 0;
        font-size: 12px;
      }

      .el-button:nth-child(2) {
        width: 42%;
        border-right: 1px solid #F3F3F3;
        border-left: 1px solid #F3F3F3;
      }
    }
  }
</style>
